10923
19331 
Sono un principiante assoluto, ho studiato da solo per due settimane in preparazione di un bootcamp in arrivo tra un mese. Nel tentativo di migliorare le mie capacità e "imparare a pensare come uno sviluppatore", ho intrapreso un progetto che tenta di risolvere un problema del mondo reale.
Mia moglie gestisce un'attività che le richiede di generare fatture per i suoi clienti. Sto tentando di utilizzare HTML e JavaScript per creare un'applicazione basata sul Web che le consenta di creare rapidamente fatture personalizzate invece di scriverle manualmente ogni volta.
Nella versione attuale, un prompt le richiede un numero. Questo numero genera un numero uguale di righe a tre colonne in HTML. Ciò le consente di personalizzare la fattura con il numero esatto di campi di cui ha bisogno.
La colonna 1 contiene il nome del prodotto. Nella stessa riga, la colonna 2 contiene il conteggio delle unità, mentre la colonna 3 contiene il costo totale di quel prodotto, che è il prezzo base moltiplicato per il conteggio delle unità. Voglio che questo calcolo avvenga al clic di un pulsante. Ma sono bloccato.
Per eseguire la matematica, devo essere in grado di ottenere i numeri interi da ogni riga e colonna e passarli in una funzione. Tuttavia, poiché ogni riga e colonna è stata generata automaticamente, non hanno attributi univoci e non possono quindi essere identificate. Sono in grado di eseguire i calcoli in ogni colonna, ma non in ogni riga.
Dato che sono così nuovo, avendo imparato solo da un paio di corsi introduttivi alla Codecademy e da alcuni video di YouTube, non so come valutare se mi sto avvicinando al progetto completamente sbagliato, o se c'è qualche trucco che mi manca, o se c'è solo qualcosa che non hai ancora imparato. Se qualcuno con una certa esperienza potesse spingermi nella giusta direzione, lo apprezzerei davvero!
Ho allegato tutto il codice a questo post. Mi scuso se è un orribile pasticcio. Vacci piano con me, sono un principiante!
const invDate = Date ();
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = function () {
let invoicedName = prompt ('A chi è intestata questa fattura?', 'Inserisci un nome');
let productFields = Number (prompt ('How many product names on this invoice?', 'Please enter a number'));
let fields = ''
let dynHtml = ''
if (invoicedName! = null && productFields! = null) {
for (sia i = 1; i <= productFields; i ++) {
campi + = campo};
} else {alert ('Please enter valid input.');
};
dynHtml = "
  
 
" +
"
 FATTURA 
" +
"
 Preparato per: " + invoicedName + ", su" +
"
" + invDate + "
 
 
" +
campi + "
 
" +
" 
";
document.write (dynHtml);
document.getElementById ('calcola'). onclick = funzione getQtyFields () {
let qtyInputs = document.getElementsByName ('qty'),
resultQty = 0;
for (let j = 0; j
2020-12-15 08:11:14 
Come hai detto, il tuo problema principale è trovare un modo per assegnare a ogni campo di input all'interno della propria riga un identificatore univoco. In questo modo puoi calcolare il prezzo per ogni riga e inserirlo nel campo del prezzo.
Devi prima iniziare con i campi:
var field = " " +
" " +
"  
 
";
document.getElementById ('newInvoice'). onclick = function () {
...
for (sia i = 1; i <= productFields; i ++) {
campi + = campo};
...
};
Ogni gruppo ha bisogno del proprio identificatore. In questo modo puoi in seguito fare riferimento a ogni input in ogni riga per calcolare il prezzo totale parziale. L'attributo class è qualcosa che puoi assegnare a più elementi per farvi riferimento in seguito. Questa classe può essere qualsiasi cosa purché non sia in conflitto con la classe per qualsiasi altra riga. Puoi utilizzare la i del ciclo come identificatore, poiché cambia ad ogni ciclo.
for (sia i = 1; i <= productFields; i ++) {
var field = " " +
" " +
"  
 
";
campi + = campo
};
Questo aggiungerà la riga della classe- {i} a ogni campo in ogni riga. Meglio ancora, puoi rifattorizzarlo nella sua funzione
function generateFields (i) {
return " " +
" " +
"  
 
";
}
for (sia i = 1; i <= productFields; i ++) {
campi + = generateFields (i);
};
Ottieni qualcosa di simile al seguente html
 
 
  
 

 
 
  
 

 
 
  
 

Ora nella funzione di calcolo puoi fare riferimento a queste righe e calcolare il loro prezzo. Qui puoi scorrere i campi di input "elemento".
document.getElementById ('calcola'). onclick = funzione getQtyFields () {
let itemInputs = document.getElementsByName ('item')
for (let i = 0; i )
for (let i = 0; i